﻿<html lang="en">
<head>
	<title>audio</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script src="http://code.jquery.com/jquery-1.5.js"></script>
	<script language="JavaScript">
		String.prototype.replaceAll = function(token, newToken, ignoreCase) {
		    var str, i = -1, _token;
		    if((str = this.toString()) && typeof token === "string") {
		        _token = ignoreCase === true? token.toLowerCase() : undefined;
		        while((i = (
		            _token !== undefined? 
		                str.toLowerCase().indexOf(
		                            _token, 
		                            i >= 0? i + newToken.length : 0
		                ) : str.indexOf(
		                            token,
		                            i >= 0? i + newToken.length : 0
		                )
		        )) !== -1 ) {
		            str = str.substring(0, i)
		                    .concat(newToken)
		                    .concat(str.substring(i + token.length));
		        }
		    }
			return str;
		};

		function callService(value){
			var extension;
			if ($.browser.mozilla)
				extension = "wav";
			else
				extension = "mp3";
			reqStr = "http://localhost:1374/Service/service.svc/GetAudioData";
			if (document.forms["form1"].alert.checked)
				alert (reqStr);
			$.ajax({
				url: reqStr,
				dataType: "jsonp",
				data: { voiceIndex: document.forms["form1"].voice.value, extension: extension, text: value },
				success: function(data) {
					var bytes;
					if (extension == "wav")
						bytes = "data:audio/wav;base64,"+data.audioBytes;
					else
						bytes = "data:audio/mpeg;base64,"+data.audioBytes;
					var audio = new Audio();
					audio.setAttribute("src", bytes);
					audio.load();
					audio.play();
				}
			});
		}
	</script>
</head>
<body>
	<form name="form1" onsubmit="return false;">
		<input type="button" value="Read" onclick="callService(this.form.input.value);" />
        <input type="checkbox" name="alert"> alert request string?<br>
        <br />Nhập voice index: <br /><input type="text" name="voice" value="1"/>
		<br />Nhập text cần đọc: <br /><textarea cols="60" rows="10" name="input"></textarea>
	</form>
</body>
</html>